import React,{useEffect} from 'react'
import { useObserver } from 'mobx-react-lite';
import { useHistory } from 'react-router-dom';
import useQueryString from '../hooks/useQueryString'
import useStore from '../context/useStore';
import styles from './article.module.scss'

const Aritice: React.FC = ()=>{
    let history = useHistory();
    let id = useQueryString(history.location.search, 'id');
    let {mine} = useStore();

    useEffect(()=>{
        mine.getArticleDetail(id);
    }, [])

    console.log('detail...', mine.detail);
    return useObserver(()=>
        <div className={styles.box}>
            {/* <p>{JSON.stringify(mine.detail)}</p> */}
            <iframe  width="100%" height='100%' title={mine.detail.title} src={mine.detail.url}></iframe>
        </div>
    )
};
export default Aritice